<template>
  <div class="myHeader">
     <span>
        <slot name="left"></slot>
     </span>
     <span>
         <slot name="center"></slot>
     </span>
     <span>
         <slot name="right"></slot>
     </span>
  </div>
</template>

<script>
import { ref, reactive, toRefs } from "vue";
export default {
  setup() {},
};
</script>
<style lang="scss" scoped>
  .myHeader{
    height: 50px;
    display: flex;
    align-items: center;
    padding: 0 10px;
    justify-content: space-between;
    background: #fff;
  }
</style>